var timer;
var on_off = false;
function action(options, _objId){
	if(on_off == false){
		on_off = true;
		switch(options)
		{
			case 1:
				actionLine(_objId);
				break;
			case 2:
				actionCircle(_objId);
				break;
			case 3:
				actionEllipse(_objId);
				break;
		}
	}
}

var arrLine = new Array();
function objLine(_objId, _stepX, _stepY, _flagX, _flagY){
	this.objId = _objId;
	this.stepX = _stepX;
	this.stepY = _stepY;
	this.flagX = _flagX;
	this.flagY = _flagY;
}
function actionLine(_arrObjId){
	for(i=0; i<_arrObjId.length; i++){
		arrLine[i] = new objLine(_arrObjId[i], 2, 2, true, true);
	}
	animation_Line();
}
function animation_Line(){
	for(i=0;i<arrLine.length;i++){
		var zz = document.getElementById(arrLine[i].objId);
		var maxLeft = document.getElementById('table').offsetWidth-zz.offsetWidth;
		var maxTop = document.getElementById('table').offsetHeight-zz.offsetHeight;
		var x = zz.offsetLeft;
		var y = zz.offsetTop;
		
		var rdNum = 1+Math.random()*19;
		if(x>=maxLeft){
			arrLine[0].flagX = true;
			arrLine[0].stepX = Math.round(rdNum);
		}else if(x<=0){
			arrLine[0].flagX = false;
			if(on_off == false)	arrLine[0].stepX = Math.round(rdNum);
		}
		if(arrLine[0].flagX == true){
			x = x-arrLine[0].stepX;
		}else x = x+arrLine[0].stepX;
		zz.style.left = x;
		
		if(y>=maxTop){
			arrLine[0].flagY = true;
			arrLine[0].stepY = Math.round(rdNum);
		}else if(y<=0){
			arrLine[0].flagY = false;
			if(on_off == false)	arrLine[0].stepY = Math.round(rdNum);
		}
		if(arrLine[0].flagY == true){
			y = y-arrLine[0].stepY;
		}else y = y+arrLine[0].stepY;
		zz.style.top = y;
		
		zz.style.zIndex="'"+rdNum+"'";
	}	
	timer = setTimeout('animation_Line()',50);
}

var objCircle = new Object();
function initCircle(_objId, _Xo, _Yo, radius, _angle) {

	objCircle = {objId : _objId,
				 Xo : _Xo, //tam x
				 Yo : _Yo, //tam y 
				 r : radius, //bán kính
				 angle : _angle   //góc quay
				};
}
function actionCircle(_objId){
	initCircle(_objId, 250, 200, 150, -90);
	animation_Circle();
}
function animation_Circle(){
	var obj = document.getElementById(objCircle.objId);
	var x;
	var y;
	objCircle.angle = objCircle.angle + 0.01;
	x = objCircle.Xo + objCircle.r*Math.cos(objCircle.angle);
	y = objCircle.Yo + objCircle.r*Math.sin(objCircle.angle);
	
	obj.style.left = x;	
	obj.style.top = y;
	
	timer = setTimeout('animation_Circle()',10);
}

var objEllipse = new Object();
function initEllipse(_objId, _Xo, _Yo, _a, _b, _angle){
	objEllipse={objId : _objId,
				Xo : _Xo, //tam x
				Yo : _Yo, //tam y 
				a : _a, // ban truc lon
				b : _b, //ban truc nho
				angle : _angle //goc quay
			   };
}
function actionEllipse(_objId){
	initEllipse(_objId, 250, 200, 200, 80, 90);
	animation_Ellipse();
}
function animation_Ellipse(_objId){
	var zz = document.getElementById(objEllipse.objId);
	var x;
	var y;
	
	var Xi;
	var Yi;
	
	objEllipse.angle = objEllipse.angle + 0.01;
	Xi = objEllipse.a*Math.cos(objEllipse.angle);
	Yi = objEllipse.b*Math.sin(objEllipse.angle);
	x = objEllipse.Xo - Xi;
	y = objEllipse.Yo - Yi;
	zz.style.left = x;
	zz.style.top = y;
	
	timer = setTimeout('animation_Ellipse('+_objId+')',10);
}

function stop(){
	clearTimeout(timer);
	on_off = false;
}

var arrMove = new Array();
function objMove(_objId, _origXY, _newXY){
	this.objId = _objId;
	this.origXY = [_origXY[0], _origXY[1]];
	this.newXY = [_newXY[0], _newXY[1]];
}
var flag=new Array();
function go(_arrObj){
	arrMove[0] = new objMove(_arrObj[0], [0,0], [100,150]);
	arrMove[1] = new objMove(_arrObj[1], [0,0], [110,190]);
	for(i=0; i<arrMove.length; i++){
		var x = arrMove[i].origXY[0];
		var y = arrMove[i].origXY[1];
		if(x>arrMove[i].newXY[0] || y > arrMove[i].newXY[1]){
			flag[i]=false;
		}else flag[i]=true;
		if(flag[i]==true){
			x = x+2;
			y = y+2;
			zz.style.left = x;
			zz.style.top = y;
			timer = setTimeout('go(arrMove)',25);
		}else return;
	}
}
// function reset(_arrObjId){
	// for(i=0;i<_arrObjId.length;i++){
		// for(j=0;j<arrLine.length;i++){
			// if(arrLine[j].objId==_arrObjId[i]){
				// arrLine[j] = new objLine(_arrObjId[i], 0, 0, true, true);
				// document.getElementById(arrLine[j].objId).style.left = 0;
				// document.getElementById(arrLine[j].objId).style.top = 0;
			// }
		// }
	// }	
	// clearTimeout(timer);
	// on_off = false;
// }

function coordinateXY(event){
	alert("X: "+event.clientX+"\nY: "+event.clientY);
}